<p-growl [(value)]="msgs" [sticky]="true"></p-growl>

<div [@pageAnimation] = "'in'" class="td-left">
  <my-breadcrumb name1="tree" name2="tree"></my-breadcrumb>

  <p-treeTable [value]="files4" selectionMode="checkbox" [(selection)]="selectedFiles2" [style]="{'margin-top':'50px'}">
    <p-header>Checkbox Selection</p-header>
    <p-column field="name" header="Name"></p-column>
    <p-column field="size" header="Size"></p-column>
    <p-column field="type" header="Type"></p-column>
  </p-treeTable>
  <p>Selected Nodes: <span *ngFor="let file of selectedFiles2">{{file.data.name}} </span></p>



  <p-tree [value]="filesTree4" selectionMode="checkbox" [(selection)]="selectedFiles3" (onNodeSelect)="onNodeSelect($event)"></p-tree>
  <p>Selected Nodes: <span *ngFor="let file of selectedFiles3">{{file.data}} </span></p>
</div>
